{% extends "./base.html" %}

{% block title %}{% block page_title %}系统管理中心{% endblock %} - 医疗科技管理系统{% endblock %}

{% block content %}
<div class="flex flex-col md:flex-row gap-6">
    <!-- 侧边菜单 -->
    <div class="w-full md:w-64 bg-white rounded-xl shadow-soft p-4">
        <h3 class="text-lg font-semibold mb-4 pb-2 border-b border-neutral-dark">系统管理菜单</h3>
        <ul class="space-y-1">
            <li>
                <a href="{% url 'admin_dashboard' %}" class="menu-item block px-4 py-2 rounded-lg hover:bg-primary/5 transition-colors">
                    <i class="fa fa-tachometer mr-2"></i>系统概览
                </a>
            </li>
            <li>
                <a href="{% url 'admin_doctors' %}" class="menu-item block px-4 py-2 rounded-lg hover:bg-primary/5 transition-colors">
                    <i class="fa fa-user-md mr-2"></i>医生管理
                </a>
            </li>
            <li>
                <a href="{% url 'admin_patients' %}" class="menu-item block px-4 py-2 rounded-lg hover:bg-primary/5 transition-colors">
                    <i class="fa fa-users mr-2"></i>患者管理
                </a>
            </li>
            <li>
                <a href="{% url 'admin_departments' %}" class="menu-item block px-4 py-2 rounded-lg hover:bg-primary/5 transition-colors">
                    <i class="fa fa-building-o mr-2"></i>科室管理
                </a>
            </li>
        </ul>
    </div>
    
    <!-- 主内容区域 -->
    <div class="flex-grow">
        <div class="bg-white rounded-xl shadow-soft p-6">
            {% block main_content %}
            <h2 class="text-2xl font-semibold mb-4">系统管理中心</h2>
            <p class="text-text-secondary">欢迎回来，{{ user.username }}管理员。这是系统管理控制台。</p>
            
            <!-- 数据卡片示例 -->
            <div class="grid grid-cols-1 md:grid-cols-3 gap-4 mt-6">
                <div class="border border-neutral-dark rounded-lg p-4">
                    <div class="flex justify-between items-start">
                        <div>
                            <p class="text-text-secondary text-sm">注册医生总数</p>
                            <h3 class="text-2xl font-bold mt-1">42</h3>
                        </div>
                        <div class="w-10 h-10 rounded-full bg-primary/10 flex items-center justify-center text-primary">
                            <i class="fa fa-user-md"></i>
                        </div>
                    </div>
                </div>
                
                <div class="border border-neutral-dark rounded-lg p-4">
                    <div class="flex justify-between items-start">
                        <div>
                            <p class="text-text-secondary text-sm">注册患者总数</p>
                            <h3 class="text-2xl font-bold mt-1">1,256</h3>
                        </div>
                        <div class="w-10 h-10 rounded-full bg-accent/10 flex items-center justify-center text-accent">
                            <i class="fa fa-users"></i>
                        </div>
                    </div>
                </div>
                
                <div class="border border-neutral-dark rounded-lg p-4">
                    <div class="flex justify-between items-start">
                        <div>
                            <p class="text-text-secondary text-sm">今日预约量</p>
                            <h3 class="text-2xl font-bold mt-1">87</h3>
                        </div>
                        <div class="w-10 h-10 rounded-full bg-secondary/10 flex items-center justify-center text-secondary">
                            <i class="fa fa-calendar"></i>
                        </div>
                    </div>
                </div>
            </div>
            {% endblock %}
        </div>
    </div>
</div>
{% endblock %}
